<template>
  测试
  <div>
    <XtxSkeleton style="margin-right:10px" width="200px" height="50px" bg="red"/>
    <XtxSkeleton style="margin-right:50px"  width="100px" height="100px" bg="skyblue"/>
    <XtxSkeleton width="50px" height="18px" bg="blue"/>
    <XtxCheckbox/>
    <XtxNumbox label="数量" v-model="num" :min="-5" :max="10"/>
    <xtx-pagination/>
    <!-- <xtx-confirm /> -->
   <button @click="del">删除</button>

  </div>
</template>
<script>
import Confirm from '@/components/confirm.js'
import XtxSkeleton from '@/components/xtx-skeleton.vue'
import { ref } from 'vue'
import XtxPagination from '@/components/xtx-pagination.vue'
// import XtxConfirm from '@/components/xtx-confirm.vue'
export default {
  name: 'playground',
  components: { XtxSkeleton, XtxPagination },
  setup () {
    const del = () => {
      Confirm({ title: '提示', text: '是否确认删除' }).then(() => {
        alert('删除...')
      }).catch(err => {
        alert('用户取消' + err)
      })
    }
    const num = ref(1)
    return { num, del }
  }
}
</script>
